<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>ViolaW第一个动画</title>
		
		<style type="text/css">
			.heart_Wrapper {
				animation: spin 8s linear 0s infinite;
			}

			@keyframes spin {
				0% {
					-webkit-transform: scale(0.1) rotate(0deg);
					transform: scale(0.1) rotate(0deg);
					opacity: 0.4;
				}

				50% {
					-webkit-transform: scale(1) rotate(360deg);
					transform: scale(1) rotate(360deg);
					opacity: 1;
				}

				80% {
					-webkit-transform: scale(0.5);
					transform: scale(1);
					opacity: 0.5;
				}

				100% {
					-webkit-transform: scale(1,2);
					transform: scale(2,2);
					opacity: 0.4;
				}
			}
		</style>
	</head>
	<body>
		<img src="E:\demo\3.jpg" class="heart_Wrapper">
	</body>
</html>